<template>
	<!-- 网格元申请 -->
	<view class="g_wp">
		<view class="g_lists">
			<view class="g_item">
				<view class="g_l_title">状态：</view>
				<view class="g_l_status">
					<text v-if="info.member.status=='0'">待审核</text>
					<text v-if="info.member.status=='1'">通过</text>
					<text v-if="info.member.status=='-1'">未通过</text>
					<text v-if="info.member.memo" class="g_l_memo">(备注:{{info.member.memo}})</text>
				</view>
			</view>
			<view class="g_item">
				<view class="g_l_title">姓名：</view>
				<input class="g_l_input" type="text" v-model="info.member.name" placeholder="请输入姓名" />
			</view>
			<view class="g_item">
				<view class="g_l_title">编号：</view>
				<input class="g_l_input" type="text" v-model="info.member.no" placeholder="请输入编号" />
			</view>
			<view class="g_item">
				<view class="g_l_title">工作证：</view>
				<view class="g_l_img" @click="upload">
					<image v-if="!info.member.thumb" src="/static/addurl.jpg" ></image>
					<image v-if="info.member.thumb" :src="info.member.thumb" ></image>
					<image v-if="isupload" class="g_l_loading" src="/static/business/loading.gif" ></image>
				</view>
			</view>
		</view>

		<button type="default" class="g_submit" @click="onsubmit">提交申请</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {
					member: {}
				},
				isupload: false,
			}
		},
		onLoad() {
			this.getInfo();
		},
		methods: {
			onsubmit() {
				if(this.info.member.name==''||this.info.member.no==''||this.info.member.thumb==''){
					this.$api.msg('请完整填写信息!');
					return ;
				}
				let obj = {
					name: this.info.member.name,
					no: this.info.member.no,
					thumb: this.info.member.thumb,
				}
				this.$axios('netmember/save', 'POST', "member", obj).then(res => {
					if (res.data.code == 200) {
						this.$api.msg('提交成功!');
						this.getInfo();
					}
				})
			},
			getInfo() {
				this.$axios('netmember/main', 'POST', "member").then(res => {
					if (res.data.code == 200) {
						this.info = res.data.data;
					}
				})
			},
			upload() {
				var that = this;
				if (this.isupload) {
					this.$api.msg('上传中，请稍后更改上传！')
					return;
				}
				var token = ""
				const value = uni.getStorageSync('token');
				if (value) {
					token = value
				}
				uni.chooseImage({
					count: 1,
					success: (res) => {
						this.isupload = true;
						uni.uploadFile({
							url: that.$url.state.url.upload,
							filePath: res.tempFilePaths[0],
							name: 'a',
							header: {
								token: token
							},
							formData: {
								'file': 'a'
							},
							success: upres => {
								var data = JSON.parse(upres.data);
								if (data.code == 200) {
									that.info.member.thumb = data.data.url;
								} else {
									that.$api.msg('上传失败请重试！');
								}
							},
							complete() {
								that.isupload = false;
							}
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		color: $font-color-dark;
	}

	.g_item {
		display: flex;
		align-items: center;
		padding: 20upx;
	}

	.g_l_status {
		flex: 1;
		color: #f00;
	}

	.g_l_memo {
		color: #0062CC;
	}

	.g_l_input {
		font-size: 28upx;
	}

	.g_l_img {
		height: 200upx;
		position: relative;
		width: 200upx;
	}

	.g_l_img image {
		height: 100%;
		width: 100%;
	}

	.g_l_img .g_l_loading {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		height: 60upx;
		width: 60upx;
	}

	.g_submit {
		background-color: $base-color;
		color: #fff;
		font-size: 28upx;
		line-height: 75upx;
		margin: 60upx auto;
		width: 92%;
	}
</style>
